<script setup lang="ts">
import type {VNodeChild} from "vue";
import { isFunction, isUrl } from '@v-c/utils'
import type {MenuDataItem} from "~/layouts/basic-layout/MenuDataItem.ts";

withDefaults(defineProps<{ item: MenuDataItem, link?: boolean }>(), {
  link: true,
})
function renderTitle(title: VNodeChild | (() => VNodeChild)) {
  if (isFunction(title))
    return title()

  return title
}
</script>

<template>
  <!-- 如果有子菜单同时不是隐藏的子菜单 -->
  <template v-if="item.children && !item.hideChildrenInMenu">
    <a-sub-menu :key="item.path">
      <!--   菜单图标   -->
      <template v-if="item.icon" #icon>

      </template>
      <!--   菜单标题   -->
      <template #title>
        {{ renderTitle(item.title) }}
      </template>
      <template v-for="menu in item.children">
        <!--    是否隐藏    -->
        <template v-if="!menu.hideInMenu">
          <!--     有子菜单嵌套当前组件     -->
          <template v-if="menu.children">
            <sub-menu :key="menu.path" :item="menu" />
          </template>
          <template v-else>
            <a-menu-item :key="menu.path">
              <template v-if="menu.icon" #icon>

              </template>
              <!--    不是全路径(比如 /platform/home/index) 使用路由跳转  -->
              <template v-if="!isUrl(menu.path)">
                <RouterLink v-if="link" :to="menu.path">
                  {{ renderTitle(menu.title) }}
                </RouterLink>
                <template v-else>
                  {{ renderTitle(menu.title) }}
                </template>
              </template>
              <!--       全路径(http://www.baidu.com)使用a标签      -->
              <template v-else>

                <a :href="menu.path" :target="menu.target ?? '_blank'">
                  {{ renderTitle(menu.title) }}
                </a>
              </template>
            </a-menu-item>
          </template>
        </template>
      </template>
    </a-sub-menu>
  </template>
  <template v-else>
    <a-menu-item :key="item.path">
      <template v-if="item.icon" #icon>

      </template>
      <template v-if="!isUrl(item.path)">
        <RouterLink v-if="link" :to="item.path">
          {{ renderTitle(item.title) }}
        </RouterLink>
        <template v-else>
          {{ renderTitle(item.title) }}
        </template>
      </template>
      <template v-else>
        <a :href="item.path" :target="item.target ?? '_blank'">
          {{ renderTitle(item.title) }}
        </a>
      </template>
    </a-menu-item>
  </template>
</template>

<style scoped>

</style>
